<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8" />
		<meta http-equiv="X-UA-Compatible" content="IE=edge" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
		<title>Document</title>
		<style>
			ul li:nth-child(3) {
				color: red;
			}

			/* n: 从0开始 */
			ul li:nth-child(4n) {
				color: orange;
			}

			ul li:nth-child(4n + 1) {
				color: blue;
			}

			ul li:nth-child(4n + 2) {
				color: aqua;
			}

			ul li:nth-child(4n + 3) {
				color: blueviolet;
			}
		</style>
	</head>
	<body>
		<ul>
			<li>列表元素1</li>
			<li>列表元素2</li>
			<!-- <span>abc</span> -->
			<li>列表元素3</li>
			<li>列表元素4</li>
			<li>列表元素5</li>
			<li>列表元素6</li>
			<li>列表元素7</li>
			<li>列表元素8</li>
		</ul>
	</body>
</html>
